<!DOCTYPE html>
<html lang="en">

<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>底部_2</title>
   <link rel="stylesheet" href="../css/bootstrap4.5.min.css">
   <link rel="stylesheet" href="../css/swiper-bundle.min.css">
   <link rel="stylesheet" href="../css/public.css">
   <style>
      .footer {
         background: var(--c_b_bottom);
      }

      .footer_box {
         display: flex;
         justify-content: space-between;
         font-weight: 400;
         border-bottom: 1px solid #e4e4e4;
      }

      .footer_left {
         width: 100%;
         max-width: 488px;
         padding: 97px 0;
      }

      .footer_left ul {
         display: flex;
         justify-content: space-between;

      }

      .footer_left ul p {
         color: var(--c_subtitle);
         line-height: 22px;
         font-size: 14px;
      }

      .footer_centent {
         padding-top: 48px;
         width: 100%;
         max-width: 170px;
         text-align: center;

      }

      .footer_centent_title p {
         font-size: 16px;
         line-height: 24px;
         color: var(--c_subtitle);
         font-weight: 400;
      }

      .footer_centent_links p {
         color: var(--c_subtitle);
         line-height: 22px;
         font-size: 14px;

      }

      .footer_centent_links ul {
         display: flex;
         flex-wrap: wrap;
         justify-content: space-between;
      }

      .footer_centent_links ul li {
         margin-top: 16px;
         flex: 50%;
      }

      .footer_right {
         width: 100%;
         max-width: 162px;
         text-align: center;
      }

      .footer_right_title p {
         padding-top: 35px;
         color: var(--c_subtitle);
         line-height: 22px;
         font-size: 14px;

      }

      .footer_right_content_logo {
         margin-top: 16px;
         display: flex;
         justify-content: space-between;
         margin-bottom: 22px;
      }

      .footer_right_content_logo p {
         width: 32px;
         height: 32px;
         background: white;
         border-radius: 50%;
      }

      .footer_right_content_call p {
         color: var(--c_subtitle);
         line-height: 22px;
         font-size: 14px;
         margin-bottom: 8px;
      }

      .footer_right_content_number p {
         font-size:var(--f_news);
         line-height:var(--l_news);
         color: var(--c_theme);
      }

      .footer_end {
         background: rgba(43, 43, 43, 1);
         padding: 35.5px 0;
         text-align: center;
      }

      .footer_end p {
         font-size: var(--f_text);
         line-height: var(--l_text);
         color: var(--c_subtitle);
      }
   </style>
   <!-- <script src="../js/jquery-3.5.1.min.js"></script> -->
   <!-- <script src="../js/bootstrap4.5.min.js"></script> -->
   <!-- <script src="../js/swiper-bundle.min.js"></script> -->

</head>

<body>
   <div class="footer">
      <div class="public_width ">
         <div class="footer_box">
            <div class="footer_left">
               <ul>
                  <li><a href="">
                        <p>产品中心</p>
                     </a></li>
                  <li><a href="">
                        <p>产品中心</p>
                     </a></li>
                  <li><a href="">
                        <p>产品中心</p>
                     </a></li>
                  <li><a href="">
                        <p>产品中心</p>
                     </a></li>
               </ul>
            </div>
            <div class="footer_centent">
               <div class="footer_centent_title">
                  <p>友情链接</p>
               </div>
               <div class="footer_centent_links">
                  <ul>
                     <li><a href="">
                           <p>友情链接</p>
                        </a></li>
                     <li><a href="">
                           <p>友情链接</p>
                        </a></li>
                     <li><a href="">
                           <p>友情链接</p>
                        </a></li>
                     <li><a href="">
                           <p>友情链接</p>
                        </a></li>
                     <li><a href="">
                           <p>友情链接</p>
                        </a></li>
                     <li><a href="">
                           <p>友情链接</p>
                        </a></li>
                  </ul>
               </div>
            </div>
            <div class="footer_right">
               <div class="footer_right_title">
                  <p>关注官方账号</p>
               </div>
               <div class="footer_right_content">
                  <div class="footer_right_content_logo">
                     <a href="">
                        <p>logo</p>
                     </a>
                     <a href="">
                        <p>logo</p>
                     </a>
                     <a href="">
                        <p>logo</p>
                     </a>
                  </div>
                  <div class="footer_right_content_call">
                     <p>服务热线</p>
                  </div>
                  <div class="footer_right_content_number">
                     <p>400-400-4400</p>
                  </div>
               </div>
            </div>
         </div>
         <div class="footer_end">
            <p>©版权号 | 备案号 </p>
         </div>
      </div>
   </div>

</body>

</html>